<template>
	<el-dialog :model-value="visible" width="40%" :z-index="9" @close="cancel">
		<template #header>
			<div class="custom-header">时间设置</div>
		</template>

		<div class="boardBox">
			<el-form ref="queryForm" label-width="120px" class="mt20" :model="queryParams" :rules="rules">
				<el-form-item label="开始截止时间：" prop="name">
					<el-date-picker v-model="queryParams.time1"
                            style="width: 80%"
                            type="date"
                            value-format="YYYY-MM-DD"
														clear
                        />
									
				</el-form-item>

				<el-form-item label="中期截止时间：" prop="name">
					<el-date-picker v-model="queryParams.time2"
                            style="width: 80%"
                            type="date"
                            value-format="YYYY-MM-DD"
														clear
                        />
											
				</el-form-item>
				<el-form-item label="结题截止时间：" prop="name">
					<el-date-picker v-model="queryParams.time3"
                            style="width: 80%"
                            type="date"
                            value-format="YYYY-MM-DD"
														clear
                        />			
				</el-form-item>
			</el-form>
			<div slot="footer" class="dialog-footer">
				<el-button type="primary">保存</el-button>
				<el-button >关闭</el-button>
			</div>
		</div>

	
	</el-dialog>
</template>
<script setup lang="ts">
import { ref, reactive, watch, nextTick} from 'vue'
import moment from 'moment'
import { ElMessage } from 'element-plus'
const props = defineProps({
	visible: {
		type: Boolean,
		default: false
	}
})
const editorValue = ref('<p>maku</p>')
const deptoptions = ref([])
const job_modeoptions = ref([])
const filelist = reactive([])

const queryParams = ref({ name: '', time1:"",time2:'',time3:''  })
const emit = defineEmits<{ (event: 'update:visible', value: boolean): void; (event: 'chananniu', value: ''): void }>()
// 获取表单引用
const queryForm = ref(null)
const uploadRef = ref(null)
// 监听 localValue 的变化，通知父组件更新值
watch(
	() => props.visible,
	newValue => {
		if (newValue) {
			// const data = { name: '', dept_id: '', position: '', hired_time: '', job_status: '', mobile: '', date: moment().format('YYYY-MM-DD') }
			// queryParams.value = data
		}
	}
)
const info = ref({ url: '', qrcode: '' })
const addvisible = ref(false)

const rules = reactive({
	name: [{ required: true, message: '请输入员工姓名', trigger: 'blur' }],
	hired_time: [{ required: true, message: '请选择入职时间', trigger: 'change' }],
	dept_id: [{ required: true, message: '请选择部门', trigger: 'change' }],
	position: [{ required: true, message: '请输入岗位', trigger: 'blur' }],
	mobile: [{ required: true, message: '请输入手机号码', trigger: 'blur' }],
	job_status: [{ required: true, message: '请选择员工状态', trigger: 'change' }]
})
const jobstatusoptions = ref([
	{ value: 1, name: '试用' },
	{ value: 2, name: '正式' }
])
const props1 = reactive({
	checkStrictly: true,
	emitPath: false,
	multiple: false,
	value: 'id',
	label: 'name',
	children: 'children'
})

// const selectedArrRef = ref(null)
// function handleChange(value) {
// 	selectedArrRef.value.togglePopperVisible()
// }





function cancel() {
	emit('update:visible', false)
	emit('chananniu', '')
}
</script>

<style lang="scss" scoped>
.boardBox {
	display: flex;
	align-items: center;
	flex-direction: column;
	flex-wrap: wrap;
	justify-content: space-around;
	overflow-y: scroll;
	height: 100%;

	&::-webkit-scrollbar {
		display: none;
	}

	-ms-overflow-style: none;
	scrollbar-width: none;

	.tishi {
		font-size: 14px;
		color: #999;
		background-color: #f3f8fb;
		padding: 5px 10px;
		border-radius: 6px;
	}
}
</style>
